{{! corresponding files: assets.php & assets.json }}

{{^connection}}
<div class="alt callout usecolor2"><div class="callout-inner">
	<div class="pure-u-1 pure-u-md-1-2">
		<h3 class="firstuse-title">{{{copy_firstuse}}}</h3>
	</div>
	<div class="pure-u-1 pure-u-md-1-2">
		<div class="browser-header"><span></span><span></span><span></span></div><!--brower-header-->
		<img src="{{www_path}}/assets/images/firstuse/asset_screen.jpg" alt="screenshot" />
	</div>
</div><!--callout-inner-->
</div><!--callout-->
	<div class="callout">
		{{#all_services}}
		<div class="pure-u-1 pure-u-md-1-2">
			<div class="callout-inner">
				{{#service_has_image}}<h3><a href="{{link}}" target="_blank"><img src="{{www_path}}/assets/images/settings/{{key}}.png" alt="{{name}}"/></a></h3>{{/service_has_image}}
				<p>{{description}}</p>
				<a class="button fullwidth lightboxed" href="{{www_path}}/settings/connections/add/{{key}}">{{copy_add_connection}}</a>
			</div><!--callout-inner-->
		</div><!--pure-->
		{{/all_services}}
	</div><!--pure-->

	<p class="center">{{copy_host_own_files}}<a href="{{www_path}}/assets/add/file" class="lightboxed">{{copy_button_add_a_file}}</a> or
	<a href="{{www_path}}/assets/add/release" class="lightboxed">{{copy_button_new_release}}</a></p>
{{/connection}}

{{#connection}}
<header>
<h4 class="page-title">{{copy_releases}}</h4>
</header>
<div class="releases">
{{#featured_releases}}
	<div class="pure-u-1 pure-u-md-1-3">
		<div class="featured-release">
				<div id="card">
					<div class="front" style="background-image:url({{cover_url}});">
						<header>
							{{#artist_name}}<h3>{{artist_name}}</h3>{{/artist_name}}
							<h2>{{title}}</h2><div class="description">
							{{#monetized}}<!-- If commerce item associated --><div class="monetised icon icon-dollar"></div><!--icon-->
							{{/monetized}}{{#has_fulfillment}}<!-- If files associated --><div class="attachement icon icon-paperclip"></div><!--icon-->{{/has_fulfillment}}
							</div>
						</header>
					</div><!--front-->
						<a href="{{www_path}}/assets/edit/{{id}}" class="back">
							<div class="release-back-background" style="background-image:url({{cover_url}});"></div><!--release-back-background-->
							<h2>{{title}}</h2>
							{{#artist_name}}<h3>{{artist_name}}</h3>{{/artist_name}}
							<span class="smalltext release-details">{{{descriptor_string}}}</span>
					</a><!--back-->
				</div><!--card-->
		</div><!--featured-release-->
	</div><!--pure-->
{{/featured_releases}}

{{#one_remaining}} <div class="pure-u-1 pure-u-md-1-3">
	<div class="ghost-release"></div>
</div><!--pure-->{{/one_remaining}}
{{#two_remaining}} <div class="pure-u-1 pure-u-md-1-3"><div class="ghost-release"></div></div><!--pure-->
<div class="pure-u-1 pure-u-md-1-3"><div class="ghost-release"></div></div><!--pure-->{{/two_remaining}}

</div><!--releases-->

{{^featured_releases}}
	<div class="empty">
		<p>{{copy_no_releases_yet}}</p>
	</div><!--empty-->
{{/featured_releases}}

{{#more_releases}}
<div class="additional_releases drawer">
	<div class="itemnav">
		<a class="drawerhandle usecolor2">{{copy_additional_releases}}</a>
	</div>
	{{#remaining_releases}}
	<div class="drawercontent pure-u-1">
		{{#remaining_releases}}
		<div class="pure-u-1 pure-u-md-1-4">
			<div class="featured-release">
				<div id="card">
					<a href="{{www_path}}/assets/edit/{{id}}">
						<div class="front" style="background-image:url({{cover_url}});"></div><!--front-->
						<div class="back">
							<div class="release-back-background" style="background-image:url({{cover_url}});"></div><!--release-back-background-->
							<h2>{{title}}</h2>
								<div class="signifier">
								{{#monetized}}
								<!-- If commerce item associated -->
								<div class="monetised icon icon-dollar"></div><!--icon-->
								{{/monetized}}
								{{#has_fulfillment}}
								<!-- If files associated -->
								<div class="attachement icon icon-paperclip"></div><!--icon-->
								{{/has_fulfillment}}
								</div><!---->
							<h3>{{artist_name}}</h3>
						<span class="smalltext release-details">{{{descriptor_string}}}</span>
						</div><!--back-->
					</a><!--link-->
				</div><!--card-->
			</div><!--featured-release-->
		</div><!--pure-->
		{{/remaining_releases}}
	</div><!--drawercontent-->
	{{/remaining_releases}}
</div><!--releases-->
{{/more_releases}}

<div class="pure-u-1">
		<a href="{{www_path}}/assets/add/release" class="button lightboxed">{{copy_button_new_release}}</a>
</div><!--pure-->

<div class="filesection pure-u-1">
<h4>{{copy_uploads}}</h4>
<div class="pure-u-1">
		<p>{{copy_not_working}} {{copy_your_spot}}</p>
</div><!--pure-->

<div class="pure-u-1 ">
<div class="material usecolor2">
	<ul>
		{{#featured_files}}
			<li><a href="{{www_path}}/assets/edit/{{id}}"><div class="inner pure-u-1 pure-u-md-2-3"><div class="icon icon-file"></div><!--icon--> <strong> {{title}} </strong> <span class="descriptive fadedtext file-description">({{descriptor_string}})</span></div><!--inner--><span class="state-icons monetised pure-u-1 pure-u-md-1-3">{{#monetized}}<div class="icon icon-dollar"></div><!--icon-->{{/monetized}}</span></a></li>
		{{/featured_files}}
	</ul>
</div><!--material-->
		{{^featured_files}}
		<div class="empty">
			<p>{{copy_no_files_added_yet}}</p>
		</div><!--empty-->
		{{/featured_files}}

		{{#more_files}}
		<div class="material drawer pure-u-1">
		<a class="drawerhandle usecolor2">additional files</a>
			<div class="drawercontent">
				<ul>
					{{#remaining_files}}
					<li><a href="{{www_path}}/assets/edit/{{id}}"><div class="inner pure-u-1 pure-u-md-2-3"><div class="icon icon-file"></div><!--icon--> <strong> {{title}} </strong> <span class="descriptive fadedtext file-description">({{descriptor_string}})</span></div><!--inner--><span class="state-icons monetised pure-u-1 pure-u-md-1-3">{{#monetized}}<div class="icon icon-dollar"></div><!--icon-->{{/monetized}}</span></a></li>
					{{/remaining_files}}
				</ul>
			</div><!--drawercontent-->
		</div><!--drawer-->
		{{/more_files}}
</div><!--display-list-->
<a href="{{www_path}}/assets/add/file" class="button lightboxed">{{copy_button_upload_new_file}}</a>

</div><!--pure-->
<script type="text/javascript">
	jQuery('div.cover').height(jQuery('div.cover').width());
</script>

{{/connection}}
